<%@page pageEncoding="utf-8"  contentType="text/html; charset=utf-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<title>login</title>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<link rel="stylesheet" type="text/css"
			href="css/style.css" />
		<script type="text/javascript" src="${pageContext.request.contextPath}/jquery-3.1.1.min.js"></script>
		
		<script type="text/javascript">
			function checkname(){
				$.ajax({
					url:"checkLoginName.do",
					data:"username="+$("#username").val(),
					type:"post",
					dataType:"json",
					success:function(obj){
						$("#usernameSpan").html(obj.message);
					
					}
					
				});
			}
			
		
			function checkPwd(){
				$.ajax({
					url:"checkLoginPwd.do",
					data:"password="+$("#password").val(),
					type:"post",
					dataType:"json",
					success:function(obj){
						$("#passwordSpan").html(obj.message);
					}
					
				});
			}
			
		
		
		</script>
			
	</head>

	<body>
		<div id="wrap">
			<div id="top_content">
					<%@include file="header.jsp" %>
				<div id="content">
					<p id="whereami">
					</p>
					<h1>
						用户登录
					</h1>
					<form action="login.do" method="post">
						<table cellpadding="0" cellspacing="0" border="0"
							class="form_table">
							<tr>
								<td valign="middle" align="right">
									用户名:
								</td>
								<td valign="middle" align="left">
									<input type="text" class="inputgri" name="username" value="${saveUsername}"  id="username" onblur="checkname();"/> 
									<span Style="color:red;font-size:14px;" id="usernameSpan"> ${usernameErr}</span>	
								</td>
							</tr>
							<tr>
								<td valign="middle" align="right">
									密码:
								</td>
								<td valign="middle" align="left">
									<input type="password" class="inputgri" name="password" value="${saveUserpwd}" id="password"  onblur="checkPwd();"/>
										<span Style="color:red;font-size:14px;" id="passwordSpan"> ${passwordErr}</span>	
								</td>
							</tr>
							<!--加入验证码验证-->
							<tr>
								<td valign="middle" align="right">
									验证码:
								</td>
								<td valign="middle" align="left">
									<input type="text" class="inputgri" name="code" />
									<img src="code.do" onclick="this.src='code.do?'+ new Date().getTime();"><!--?后带的时间是让浏览器觉得是不同请求,从而向服务器发请求而不使用本地的缓存图片--><br>
								</td>
							</tr>
							<!--加入记住密码和自动登录-->
							<tr>	
								<td valign="middle" align="right">
									操作:
								</td>
								<td valign="middle" align="left">
									<input type="checkbox" id="save" name="save" 
									<c:if test="${save!=null}">
									checked
									</c:if>
									>
									<label for="savepwd">记住密码</label>
									<input type="checkbox" id="autolog" name="auto" 
									<c:if test="${auto!=null}">
									checked
									</c:if>
									>
									<label for="autolog">自动登录</label>
								</td>
							</tr>
						</table>
						<p>
							<input type="submit" class="button" value="登录&raquo" />
						</p>
					</form>
						
				</div>
			</div>
			<%@include file="footer.jsp" %>
		</div>
	</body>
</html>
